<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>AceDemo</title>
    <style>
        *{
            padding:0px;
            margin:0px;
        }
        html,body{
            height: 100%;
            width: 100%;
            overflow: hidden;
        }
        #editor-container{
            height: 100%;
            width: 100%;
        }
    </style>
</head>
<body>
<div id="editor-container"></div>
<script src="js/ace.min.js"></script>
<!--要更改主题，只需包含主题的JavaScript文件-->

<script src="js/theme-chrome.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/theme-tomorrow_night.min.js" type="text/javascript" charset="utf-8"></script>
<!--默认情况下，编辑器只支持纯文本模式;许多其他语言作为单独的模块可用。在包含该模式的JavaScript文件后:-->
<script src="js/mode-java.min.js" type="text/javascript" charset="utf-8"></script>
<script>
    // https://cdnjs.com/libraries/ace

    var editor = ace.edit("editor-container");
    // 使用主题:
    editor.setTheme("ace/theme/chrome");
    // 使用模式
    editor.session.setMode("ace/mode/java");

    //字体大小
    editor.setFontSize(14);
    editor.setOptions({
        showGutter: true, // 显示左侧内容（行号和折叠内容）
        showFoldWidgets: true, // 显示折叠小部件
        showLineNumbers: true, // 是否显示行号
        readOnly: false, // 设置只读（true时只读，用于展示代码）
        wrap: 'off', // 自动换行,off：关闭 , free：开启
        enableBasicAutocompletion: true,
        enableSnippets: true,
        enableLiveAutocompletion: true,
        showPrintMargin: false, // 打印边距
    });

    // 设置模式
    function setEditorMode(mode){
        editor.session.setMode(mode);
    }

    // 设置内容
    function setEditorValue(value){
        editor.setValue(value,1);
        // editor.setValue("text2", -1); // set value and move cursor to the start of the text
        // editor.session.setValue("the new text here"); // set value and reset undo history
    }

    // 获取内容
    function getEditorValue(value){
        return editor.getValue(); // or session.getValue
    }

    // 删除选中的内容
    function removeSelectRange(){
        var range = editor.getSelectionRange();
        editor.remove(range);
    }

    // 监听窗口大小变化
    window.addEventListener('resize', function() {
        // 在这里执行窗口大小变化后的操作
        editor.resize();
    });

    // 监听内容变化
    editor.on('change', function(delta) {
        // delta.start, delta.end, delta.lines, delta.action
        try{
            window.AceView.textChange(editor.getValue()); // 通知javafx(AceView)程序内容发生变化。
        }catch(err){
        }
    });

</script>
</body>
</html>